<template>
	<page-body>
		<view class="page">
			<view
				class="flex flex-direction flex-wrap align-stretch justify-center benben-position-layout flex changePwdPhone_flex_0_higd"
				:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx', }">
				<view class='flex flex-wrap align-stretch justify-between changePwdPhone_fd0_0_higd'>
					<view class='flex flex-wrap align-center changePwdPhone_fd0_0_c0_higd' @tap.stop="handleJumpDiy"
						data-type="back" data-url="1">
						<text class='fu-iconfont2  changePwdPhone_fd0_0_c0_c0_higd'>&#xe794;</text>
					</view>
					<view class='flex flex-wrap align-center'>
						<text class='changePwdPhone_fd0_0_c1_c0_higd'>{{$t('修改密码')}}</text>
					</view>
					<view class='flex align-center justify-end changePwdPhone_fd0_0_c2_higd'>
					</view>
				</view>

			</view>
			<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
			<!---修改密码-手机验证-表单flex布局开始-->
			<view class="flex flex-direction flex-wrap align-stretch changePwdPhone_flex_1_higd">
				<view class='flex flex-wrap align-center changePwdPhone_fd1_0_higd'>
					<text class='changePwdPhone_fd1_0_c0_higd'>{{$t('新密码')}}</text>
					<benben-input class='flex-sub changePwdPhone_fd1_0_c1_higd' type="text" :focus='true'
						:placeholder="$t('请输入新密码')" confirm-type="done" :maxlength="12" :password='true'
						placeholder-style="color:#999;font-size:32rpx" v-model="newPwd" />
				</view>
				<view class='flex flex-wrap align-center changePwdPhone_fd1_0_higd'>
					<text class='changePwdPhone_fd1_1_c0_higd'>{{$t('确认新密码')}}</text>
					<benben-input class='flex-sub changePwdPhone_fd1_0_c1_higd' type="text"
						:placeholder="$t('请再次输入新密码')" confirm-type="done" :maxlength="12" :password='true'
						placeholder-style="color:#999;font-size:32rpx" v-model="qrPwd" />
				</view>
				<button class='changePwdPhone_fd1_2_higd' @tap.stop="checkPwdFunc()">{{$t('完成')}}</button>
			</view>

			<!---修改密码-手机验证-表单flex布局结束-->


		</view>
	</page-body>
</template>
<script src="https://cdnjs.cloudflare.com/ajax/libs/blueimp-md5/2.19.0/js/md5.min.js"></script>
<script>
	import {
		validate
	} from '@/common/utils/validate.js'
	import { host } from '@/common/config.js';
	import CryptoJS from 'crypto-js';
	
	function md5Encrypt(message) {
		return CryptoJS.MD5(message).toString();
	}
	export default {
		components: {},


		data() {
			return {
				"newPwd": "",
				"qrPwd": "",
				"mobile": "",
				"code": "1234"
			};
		},
		computed: {

		},
		watch: {},
		onLoad(options) {
			let {
				mobile,
				code
			} = options
			if (mobile !== undefined) this.mobile = mobile
			if (code !== undefined) this.code = code
			this.md5Func()
		},
		onUnload() {

		},
		onReady() {

		},
		onShow() {

		},
		onHide() {

		},
		onResize() {

		},
		onPullDownRefresh() {

		},
		onReachBottom(e) {

		},
		onPageScroll(e) {

		},
		methods: {
			//引入md5
			md5Func() {
				console.log(9999)
				return
				var s = document.createElement("script");
				console.log(s)
				s.src = "https://cdnjs.cloudflare.com/ajax/libs/blueimp-md5/2.19.0/js/md5.min.js";
				document.head.appendChild(s);
				s.addEventListener("load", function() {
					// 等待s的load事件加载完响应，防止未加载完就调用出错
					console.log(md5);
				})
			},
			//校验密码
			async checkPwdFunc() {
				if (!validate(this.newPwd, 'require')) {
					this.$message.info(global.i18n.t('请输入新密码'));
					return false;
				}
				if (!validate(this.newPwd, 'password')) {
					this.$message.info(global.i18n.t('请输入新密码（6~12位字母+数字）'));
					return false;
				}
				if (!validate(this.qrPwd, 'require')) {
					this.$message.info(global.i18n.t('请输入确认密码'));
					return false;
				}
				if (!validate(this.qrPwd, 'password')) {
					this.$message.info(global.i18n.t('请输入确认密码（6~12位字母+数字'));
					return false;
				}
				if (!(this.newPwd == this.qrPwd)) {
					this.$message.info(global.i18n.t('两次输入密码不一致'));
					return false;
				}
				//请求方法
				//数据验证
				let url=global.apiUrls.post5caeeba9866aa	
				// 教师
				if(uni.getStorageSync('USER_GROUP') ==2){
					url=host+'/api/v1/5caeeba9866aa'
					console.log(global.istest)
					global.istest=0
				}
				console.log(this.qrPwd)
				let encryptedMessage = md5Encrypt(this.qrPwd); // 要加密的信息
				let data5caeeba9866aa = await this.$api.post(url, {
					// password: this.qrPwd,
					password:uni.getStorageSync('USER_GROUP') ==2?encryptedMessage:this.qrPwd,//md5加密
					account: this.mobile,
					mobile:this.mobile,
					code: this.code,
					type: '2',
					account_type: 'mobile'
				});
				
				if (data5caeeba9866aa.data.code != 1) {
					global.istest=0
					this.$message.info(data5caeeba9866aa.data.msg);
					return
				}
				global.istest=0
				let info5caeeba9866aa = data5caeeba9866aa.data;

				this.$message.info(info5caeeba9866aa.msg)
				uni.setStorageSync('USER_TOKEN', '');
				uni.setStorageSync('USER_TOKEN_7863', '');
				uni.setStorageSync('USER_INFO_7863', '');
				uni.setStorageSync('USER_INFO', '');
				global.token=''
				setTimeout(() => {
					this.$urouter.reLaunch(`/pagetabBar/loginPage/loginPage`);
				}, 500)
			}
		}
	};
</script>
<style lang="scss" scoped>
	.page {
		width: 100vw;
		overflow-x: hidden;
		min-height: calc(100vh - var(--window-bottom));
		background: #fff;
		background-size: 100% auto;

		.changePwdPhone_flex_1_higd {
			font-size: 32rpx;
			background: #fff;
			background-size: 100% auto !important;
			padding: 0rpx 32rpx 0rpx 32rpx;

			.changePwdPhone_fd1_2_higd {
				border-radius: 44rpx 44rpx 44rpx 44rpx;
				font-size: 32rpx;
				background: rgba(211, 42, 41, 1);
				color: var(--benbenFontColor3);
				width: 686rpx;
				height: 88rpx;
				line-height: 88rpx;
				font-weight: 500;
				margin: 600rpx 0rpx 0rpx 0rpx;
			}
		}

		.changePwdPhone_fd1_0_higd {
			padding: 32rpx 0rpx 32rpx 0rpx;
			border-bottom: 1px solid #eee;

			.changePwdPhone_fd1_0_c0_higd {
				font-size: 32rpx;
				font-weight: 400;
				font-style: normal;
				color: var(--benbenFontColor0);
				margin: 0rpx 48rpx 0rpx 0rpx;
			}
		}

		.changePwdPhone_fd1_0_c1_higd {
			line-height: 45rpx;
			font-size: 32rpx;
			font-weight: 400;
			color: var(--benbenFontColor0);
		}

		.changePwdPhone_fd1_1_c0_higd {
			font-size: 32rpx;
			font-weight: 400;
			font-style: normal;
			color: var(--benbenFontColor0);
			width: 182rpx;
		}

		.changePwdPhone_flex_0_higd {
			width: 750rpx;
			height: 88rpx;
			overflow: hidden;
			z-index: 10;
			top: 0rpx;
			background: #fff;
			background-size: 100% auto !important;
			border-bottom: 1px solid #eee;

			.changePwdPhone_fd0_0_higd {
				padding: 0rpx 32rpx 0rpx 32rpx;
				line-height: 88rpx;

				.changePwdPhone_fd0_0_c0_higd {
					width: 100rpx;

					.changePwdPhone_fd0_0_c0_c0_higd {
						font-size: 36rpx;
						font-weight: 400;
						color: #333;
					}
				}

				.changePwdPhone_fd0_0_c1_c0_higd {
					font-size: 36rpx;
					font-weight: 500;
					color: var(--benbenFontColor0);
					line-height: 50rpx;
				}

				.changePwdPhone_fd0_0_c2_higd {
					padding: 0rpx 0rpx 0rpx 0rpx;
					width: 100rpx;
				}
			}
		}
	}
</style>
